<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<c:set var="ctx" value="${pageContext.request.contextPath}" />

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>容量监控</title>
<%@ include file="/WEB-INF/view/common/include.jsp"%>
<link href="${ctx}/resources/style/main.css" rel="stylesheet">
<script src="${ctx}/resources/pluginJs/hightcharts-4.1.5/highcharts.js"></script>
<script src="${ctx}/resources/pluginJs/hightcharts-4.1.5/themes/grid-light.js"></script>
<script
	src="${ctx}/resources/pluginJs/hightcharts-4.1.5/highcharts-more.js"></script>
<script type="text/javascript" src="${ctx}/resources/useJs/monitor/capacity.js"></script>
<script type="text/javascript"
	src="${ctx}/resources/pluginJs/jquery-easyui-1.4.1/easyui-patch.js"></script>
<script type="text/javascript"
	src="${ctx}/resources/pluginJs/zTree/js/jquery.ztree.core-3.5.min.js"></script>
<link rel="stylesheet" type="text/css"
	href="${ctx}/resources/pluginJs/jquery-easyui-1.4.1/themes/icon.css">
<link rel="stylesheet" type="text/css"
	href="${ctx}/resources/pluginJs/jquery-easyui-1.4.1/themes/color.css">
<link href="${ctx}/resources/pluginJs/zTree/css/ztree.css"
	rel="stylesheet">
<style type="text/css">
.ztree LI SPAN.button {
	filter: none;
}

.tab_custom {
	bolder-right: 1px solid #95B8E7 !important;
}
</style>
</head>

<body class="easyui-layout" style="scroll: yes">

	<div id="main_center" region="center" split="false" bolder="false">
		<div id="aa" class="easyui-layout"
			data-options="fit : true,bolder : true"
			style="margin-top: 5px; margin-left: 4px; padding-left: 4px; padding-right: 5px; padding-bottom: 5px;">
			<div data-options="region:'north',split:true" title="总容量监控"
				style="height: 100%; padding: 10px;">
				<!-- 二层 -->
				<div class="easyui-layout" data-options="fit : false,bolder : true"
					style="margin-top: 5px; margin-left: 4px; padding-left: 4px; padding-right: 5px; padding-bottom: 5px;">
					<c:forEach items="${groupInfo}" var="group">
						<div class="easyui-panel" style="width: 100%; padding: 2px;"
							data-options="title:'${group.groupName}',collapsible:true,closable:true">
							<c:forEach items="${group.storageList}" var="storage"
								varStatus="status">
								<div class="storage" style="float: left; margin-right: 5px">
									<input type="hidden" value="${storage.freeMB}" name="freeMB" />
									<input type="hidden" value="${storage.totalMB}" name="totalMB" />
									<input type="hidden" value="${storage.ipAddr}" name="ip" />
								</div>
							</c:forEach>
						</div>
					</c:forEach>
				</div>
			</div>
		</div>
	</div>


</body>
</html>